import styles from './List.module.scss';

import QuestionCard from '../../components/QuestionCard.tsx';


const rawQuestionsList = [
  {
    id: 'q1',
    title: '问卷 1',
    description: 'Description 1',
    isPublished: false,
    answerCount: 1,
    createdAt: '2024-12-04',
  },
  {
    id: 'q2',
    title: '问卷 2',
    description: 'Description 2',
    isPublished: true,
    answerCount: 5,
    createdAt: '2024-12-04',
  },
  {
    id: 'q3',
    title: '问卷 3',
    description: 'Description 3',
    isPublished: false,
    answerCount: 2,
    createdAt: '2024-12-04',
  },
  {
    id: 'q4',
    title: '问卷 4',
    description: 'Description 4',
    isPublished: true,
    answerCount: 34,
    createdAt: '2024-12-04',
  },
  {
    id: 'q5',
    title: '问卷 5',
    description: 'Description 5',
    isPublished: true,
    answerCount: 5,
    createdAt: '2024-12-04',
  },
];

const List = () => {
  return (
  <>
    <div className={styles.header}>
      <div className={styles.left}>
        <h3>全部问卷</h3>
      </div>
      <div className={styles.right}>(搜索)</div>
    </div>
     <div className={styles.content}>{
      rawQuestionsList.map(q => (
        <QuestionCard key={q.id} {...q} />
      ))
      }</div>
     <div className={styles['button-container']}>
     <footer className={styles.footer}>list page footer</footer>
     </div>
  </>
  );
};

export default List;
